跳到主要内容

组件事件

触发与监听事件

通过 v-on (缩写为 @) 来监听事件,需要使用$emit包装来触发自定义事件。

<MyComponent @some-event="callback" />
<!-- MyComponent -->
<button @click="$emit('someEvent')">Click Me</button>

在 react 中,一切都是 props;没有那么多事。

声明触发的事件

  1. <template> 中使用的 $emit 方法,不能在组件的 <script setup> 部分中使用
    • 打补丁:可以显式地通过 defineEmits()
  2. defineEmits() 宏又不能在子函数中使用。
    • 需要通过 emits 选项来定义

😂 真会玩(正确理解用法,就是版本使用中强制版本不能混合写法,避免不兼容写法问题),还是 react 香。

// 父组件调用子组件方法,defineExpose
// 子组件调用父组件方法,emit

参考链接

https://cn.vuejs.org/guide/components/events.html